import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _isFunction from "lodash/isFunction";

/**
 * Preview.js
 * should change key if pageCode hasChange
 * warn update immute after set config for load props's like 'this.refXXX'
 * @date 2018/10/10
 */
import React from 'react';
import { Button
/* , Spin */
} from 'antd'; // import { getResponse } from 'utils/utils';

import intl from 'utils/intl';
import { Header, Content } from 'components/Page';
import DynamicPage from 'components/DynamicComponent/DynamicPage';
import ValueList from 'components/ValueList';
import styles from "./index.less?modules";
var id = 0;
var resolutionMap = {
  '0': {
    style: {
      width: 800,
      height: 600,
      overflow: 'auto'
    }
  },
  '1': {
    style: {
      width: 1024,
      height: 768,
      overflow: 'auto'
    }
  },
  '2': {
    style: {
      width: 1366,
      height: 768,
      overflow: 'auto'
    }
  },
  '3': {
    style: {
      width: 1920,
      height: 1080,
      overflow: 'auto'
    }
  }
};
var resolutionOptions = [{
  value: '0',
  meaning: '800x600'
}, {
  value: '1',
  meaning: '1024x768'
}, {
  value: '2',
  meaning: '1366x768'
}, {
  value: '3',
  meaning: '1920x1080'
}];

var Preview = /*#__PURE__*/function (_React$Component) {
  _inherits(Preview, _React$Component);

  var _super = _createSuper(Preview);

  function Preview(props) {
    var _this;

    _classCallCheck(this, Preview);

    _this = _super.call(this, props);
    _this.state = {
      // fetching: false,
      dynamicPageId: id,
      resolutionKey: '2'
    };
    _this.handleRefreshBtnClick = _this.handleRefreshBtnClick.bind(_assertThisInitialized(_this));
    _this.resolutionChange = _this.resolutionChange.bind(_assertThisInitialized(_this));
    return _this;
  }

  _createClass(Preview, [{
    key: "render",
    value: function render() {
      var _this$state = this.state,
          resolutionKey = _this$state.resolutionKey,
          dynamicPageId = _this$state.dynamicPageId; // TODO Spin will destroy layout, so what todo

      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
        title: intl.get('cpaas.common.button.preview').d('预览')
      }, /*#__PURE__*/React.createElement(Button, {
        type: "primary",
        onClick: this.handleRefreshBtnClick,
        style: {
          marginRight: 10
        }
      }, intl.get('cpaas.common.button.refresh').d('刷新')), /*#__PURE__*/React.createElement(ValueList, {
        options: resolutionOptions,
        value: resolutionKey,
        onChange: this.resolutionChange,
        style: {
          width: 120
        }
      })), /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement("div", Object.assign({
        className: styles.preview
      }, resolutionMap[resolutionKey]), /*#__PURE__*/React.createElement(DynamicPage, {
        key: dynamicPageId,
        pageCode: this.getPageCode()
      }))));
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {// const { needResetToLoadDynamicRef } = this.state;
      // if (needResetToLoadDynamicRef) {
      //   this.reRender();
      // }
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {}
  }, {
    key: "getPageCode",
    value: function getPageCode() {
      var pageCode = this.props.pageCode;
      return pageCode;
    }
  }, {
    key: "handleRefreshBtnClick",
    value: function handleRefreshBtnClick(e) {
      e.preventDefault();
      var onRefresh = this.props.onRefresh;

      if (_isFunction(onRefresh)) {
        onRefresh();
      }

      this.reRender();
    }
  }, {
    key: "resolutionChange",
    value: function resolutionChange(resolutionKey) {
      this.setState({
        resolutionKey: resolutionKey
      });
    }
    /**
     * for load props's like 'this.refXXX'
     */

  }, {
    key: "reRender",
    value: function reRender() {
      this.setState({
        dynamicPageId: id++
      });
    }
  }]);

  return Preview;
}(React.Component);

export { Preview as default };